import React, { useEffect, useState } from 'react'
import { useLocation } from 'react-router-dom';
import api from '../../api';
import { Form, Table } from 'antd';
import TextArea from 'antd/es/input/TextArea';
const RecipeLock = () => {
    // 和数据双向绑定
    const location = useLocation()

    const { type, id } = Object.fromEntries(new URLSearchParams(location.search).entries())

    // 详情
    const [details, setdetails] = useState([])
    const [open, setopen] = useState([])
    // 获取一个菜谱详情
    const getaSearchMenu = async (_id) => {
        const res = await api.searchMenu.menuDetail({ _id })
        // console.log('res', res);
        if (res.meta.status == 200) {
            setdetails(res.message[0].ingredient)
            setopen(res.message[0].method)
        }
    }
    useEffect(() => {
        getaSearchMenu(id)
    }, [])

    return (
        <>
            <div>
                {
                    type === 'yl' && open.map(item => item.describe).join('/')
                }
            </div>
            <div>
                {
                    type === 'ac' && details.map((item) => (item.name + item.number)).join('/')
                }
            </div>
        </>
    )
}


export default RecipeLock